<template>
    <div>
        <el-dialog title="修改按钮联络灯请求" :visible.sync="dialogVisible" width="430px" @close='close'
            :close-on-click-modal='false'>
            <div class="dialogBody">
                <el-form :inline="true" :model="form" label-width="120px" size="mini" ref="form">
                    <el-form-item label="联络灯请求" prop="lampTypeId">
                        <el-select v-model="form.lampTypeId" filterable placeholder="请选择" clearable>
                            <el-option v-for="item in lampTypeList" :key="item.value" :label="item.label" :value="item.value">
                            </el-option>
                        </el-select>
                    </el-form-item>
                </el-form>
            </div>
            <span slot="footer" class="footer">
                <el-button size="mini" @click='dialogVisible = false'>取 消</el-button>
                <el-button type="primary" size="mini" @click="confirm">确 定</el-button>
            </span>
        </el-dialog>
    </div>
</template>

<script>
    import {
       lampTypeDropDown
    } from '@/api/lampController'
    export default {
        data() {
            return {
                form: {
                    id:'',
                    groupId: '',
                    lampTypeId: ''
                },
                lampTypeList:[],
                dialogVisible: false,
            }
        },
        methods: {
            open(payload) {
                const {id,groupId,lampTypeId} = payload
                this.form.id = id
                this.form.groupId = groupId
                this.form.lampTypeId = lampTypeId === null ? '' : String(lampTypeId)
                this.dialogVisible = true
            },
            close() {
                this.$refs.form.resetFields()
            },
            //联络灯类型下拉
            lampTypeDropDownFn:async function(data){
                const res = await lampTypeDropDown(data)
                if (res.code == 200) {
                    this.lampTypeList = res.data
                }
            },
            //确定
            confirm() {
                this.$emit('updateList',this.form)
                this.dialogVisible = false
            }
        }
    }
</script>

<style lang="less" scoped>
    .el-form-item--mini.el-form-item {
        width: 90%;

        /deep/ .el-form-item__content {
            width: 60%;
        }

        .el-select {
            width: 100%;
        }
    }

    /deep/ .el-dialog__body {
        padding: 8px 20px 0 20px;

        .dialogBody {
            padding-top: 10px;
        }
    }
</style>